<%@ page import="com.scau.ums.model.User" %><%--
  Created by IntelliJ IDEA.
  User: Fullcy
  Date: 2019/8/1
  Time: 16:04
  To change this template use File | Settings | File Templates.
--%>

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html class="no-js" lang="en">

<head>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Home</title>
    <meta name="robots" content="noindex, follow" />
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">

    <!-- CSS
	============================================ -->
    <!-- google fonts -->
    <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:300,300i,400,400i,600,700,800,900%7CPoppins:300,400,500,600,700,800,900" rel="stylesheet">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrapmin.css">
    <!-- Font-awesome CSS -->
    <link rel="stylesheet" href="css/font-awesomemin.css">
    <!-- Slick slider css -->
    <link rel="stylesheet" href="css/slickmin.css">
    <!-- animate css -->
    <link rel="stylesheet" href="css/animate.css">
    <!-- Nice Select css -->
    <link rel="stylesheet" href="css/nice-select.css">
    <!-- jquery UI css -->
    <link rel="stylesheet" href="css/jqueryuimin.css">
    <!-- main style css -->
    <link rel="stylesheet" href="css/style.css">

    <link rel="stylesheet" href="css/upload-user-layui.css">

    <!-- JS
    ============================================ -->

    <!-- Modernizer JS -->
    <script src="js/modernizr-3.6.0min.js"></script>
    <!-- jQuery JS -->
    <script src="js/jquery-3.3.1min.js"></script>
    <!-- Popper JS -->
    <script src="js/poppermin.js"></script>
    <!-- Bootstrap JS -->
    <script src="js/bootstrapmin.js"></script>
    <!-- slick Slider JS -->
    <script src="js/slickmin.js"></script>
    <!-- Countdown JS -->
    <script src="js/countdownmin.js"></script>
    <!-- Nice Select JS -->
    <script src="js/nice-selectmin.js"></script>
    <!-- jquery UI JS -->
    <script src="js/jqueryuimin.js"></script>
    <!-- Image zoom JS -->
    <script src="js/image-zoommin.js"></script>
    <!-- image loaded js -->
    <script src="js/imagesloadedpkgdmin.js"></script>
    <!-- masonry  -->
    <script src="js/masonrypkgdmin.js"></script>
    <!-- mailchimp active js -->
    <script src="js/ajaxchimp.js"></script>
    <!-- contact form dynamic js -->
    <script src="js/ajax-mail.js"></script>
    <!-- google map api -->
    <script src="http://ditu.google.cn/maps/api/js?key=AIzaSyCfmCVTjRI007pC1Yk2o2d_EhgkjTsFVN8"></script>
    <!-- google map active js -->
    <script src="js/google-map.js"></script>
    <!-- Main JS -->
    <script src="js/main.js"></script>


    <style type="text/css">
        .table-operation-botton{
            background-color: #dee1e6;
            color: #444444;
            padding: 3px 3px;
            font-size: 13px;
            border-radius: 4px;
        }
        .table-operation-botton:hover {
            background: #f0f2f3;
        }
        .table-div {
        }
          .table-div table {
            font-size: 15px;
            width: 30%;
            table-layout: fixed;  /*不添加此样式，会全部显示    */
        }

        .table-div table td {
            padding: 5px;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
        .table-div table td:hover { /* 鼠标滑过  显示隐藏的内容  伴有横向的滚动条 */
            overflow:auto;
            text-overflow:clip;
        }

        .black-all{
            display: none;
            position: absolute;
            top: 0%;
            left: 0%;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index:1001;
            -moz-opacity: 0.8;
            opacity:.80;
            filter: alpha(opacity=88);
        }
        .light-content {
            display: none;
            position: fixed;
            top: 35%;
            left: 25%;
            width: 50%;
            padding: 20px;
            background-color: #e7eaed;
            z-index:1002;
            overflow: auto;
            border-radius:10px
        }
        .jumpbtn:hover{
            color: #0000FF;
        }
    </style>

    <%--"我的"按钮判断跳转--%>
    <script>
        function wodeRedirect() {
            var jsUserType = '<%=request.getSession().getAttribute("USER_TYPE")%>';
            if(jsUserType=='<%=User.ADMIN%>')
            {
                window.location.href="/adminEntrance";
            }
            if(jsUserType=='<%=User.MAINTAINER%>')
            {
                window.location.href="/maintainerEntrance";
            }
            if(jsUserType=='<%=User.STUDENT%>'||jsUserType=='<%=User.TEACHER%>')
            {
                window.location.href="/userEntrance";
            }
        }
    </script>
</head>

<body>
<header class="header-area">

    <div class="main-header d-none d-lg-block">
        <!--顶部left开始-->
        <div class="header-top black-bg">
            <div class="container">
                <!--顶部选择-->
                <div class="row align-items-center">
                    <div class="col-lg-6">
                        <div class="top-left-navigation">
                            <ul class="nav align-items-center">
                            </ul>
                        </div>
                    </div>
                    <div class="col-lg-6 d-flex justify-content-end">
                        <div class="header-social-link">
                        </div>
                        <ul class="user-info-block">
                            <!--登录开始-->
                            <%if (request.getSession().getAttribute("USER_NAME")==null){%>
                            <li><a href="/login"><i class="fa fa-sign-in"></i> 登录</a></li>
                            <%}else{%>
                            <ul class="nav">
                                <!--登录开始-->
                                <li class="mini-cart-wrap">
                                    <a href="#" class="minicart-btn">
                                        <span class="fa fa-user-circle-o"></span>
                                        <% String username=(String)request.getSession().getAttribute("USER_NAME");System.out.println(username);out.print(username);%>
                                    </a>

                                    <!--两个按钮开始-->
                                    <div class="cart-list-wrapper">
                                        <div class="minicart-button">
                                            <a onclick="wodeRedirect()"><i class="fa fa-user-plus"></i> 我的</a>
                                            <a href="/logout"><i class="fa fa-user-times"></i> 注销</a>
                                        </div>
                                    </div>
                                    <!--两个按钮结束-->
                                </li>
                                <!--登录结束-->
                            </ul>
                            <%}%>
                            <!--登录结束-->
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <!--顶部left结束-->

        <div class="header-main-area black-soft sticky">
            <div class="container">
                <div class="row align-items-center position-relative">
                    <!-- logo展示开始 -->
                    <div class="col-auto">
                        <div class="logo">
                            <a href="/">
                                <img src="img/2.jpg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <!-- logo展示结束 -->
                    <div class="col-auto position-static">
                        <div class="main-menu-area">
                            <div class="main-menu">
                                <!-- 标签栏开始 -->
                                <nav class="desktop-menu">
                                    <ul>
                                        <li class="active"><a href="/adminEntrance">主页 <i class="fa fa-angle-left"></i></a>
                                        </li>
                                        <li class="active"><a href="/adminEntrance">管理模块 <i class="fa fa-angle-left"></i></a>
                                            <ul class="dropdown">
                                                <li><a href="publishNews">发表新闻 <i class="fa fa-plus"></i></a>
                                                </li>
                                                <li><a href="GetverifySuggestions">言论管理 <i class="fa fa-twitch"></i></a>
                                                </li>
                                                <li><a href="verifyLostAndFound">失物招领审核 <i class="fa fa-gratipay"></i></a>
                                                </li>
                                                <li><a href="listUser">用戶管理与数据中心 <i class="fa fa-user-plus"></i></a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a href="#">用戶管理与数据中心 <i class="fa fa-angle-down"></i></a>
                                        </li>
                                    </ul>
                                </nav>
                                <!-- 标签栏结束 -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>


<main>
    <script>
        //userType :student teacher maintainer

        //页面默认显示学生的列表（通过点击btn2-1按钮）
        $(document).ready(function(){
            document.getElementById("btn2-1").click();
        });
        //将jason字符串中的null转为空白符
        function null2str(data) {
            for (let x in data) {
                if (data[x] === null) { // 如果是null 把直接内容转为 ''
                    data[x] = '';
                } else {
                    if (Array.isArray(data[x])) { // 是数组遍历数组 递归继续处理
                        data[x] = data[x].map(z => {
                            return null2str(z);
                        });
                    }
                    if(typeof(data[x]) === 'object'){ // 是json 递归继续处理
                        data[x] = null2str(data[x])
                    }
                }
            }
            return data;
        }

        //指定页码跳转判断
        function JumpCheck(sumPage,userTpye,keyWord) {
            var page;
            if(document.getElementById("jumpPage").value == null || document.getElementById("jumpPage").value === "")
                page = 1;
            else
                page = parseInt(document.getElementById("jumpPage").value);

            var toPage;
            if(page < 1 ){
                toPage = 1;
            }
            else if(page <= sumPage){
                toPage = page;
            }
            else {
                toPage = sumPage;
            }
            if(userTpye === "student"){
                getStudent(toPage,keyWord);
            }
            else if(userTpye === "teacher"){
                getTeacher(toPage,keyWord);
            }
            else {
                getMaintainer(toPage,keyWord);
            }
        }
        function getUserByKeyword() {
            var type = document.getElementById("display-content-id").getAttribute("type");
            var content = document.getElementById("search-keyword").value;
            if(type === "student"){
                getStudent(1,content);
            }
            else if(type === "teacher"){
                getTeacher(1,content);
            }
            else if(type === "maintainer"){
                getMaintainer(1,content);
            }
        }

        //div块显示控制
        function msgbox(n){
            if(n === 1){
                document.getElementById('deleteWarning-div').style.display='block';
                document.getElementById('fade').style.display='block';
            }
            else if(n === 2){
                document.getElementById('resetPasswordWarning-div').style.display='block';
                document.getElementById('fade').style.display='block';
            }
            else {
                document.getElementById('fade').style.display='none';
                document.getElementById('deleteWarning-div').style.display='none';
                document.getElementById('resetPasswordWarning-div').style.display='none';
            }
        }
        //删除用户的警告提示弹窗（userId用户id，userName用户姓名，userType用户类型，keyWord当前搜索栏关键字，page当前页码
        function deleteWarning(userId,userName,userType,keyWord,page) {
            $("#deleteContent").empty();
            var str = "";
            var tips = "";
            var userInfo = "";
            if (userType === "student"){
                tips = "是否删除以下学生用户?";
                userInfo = "<br>学号：" + userId + "<br/>姓名：" + userName;
            }
            else if(userType === "teacher"){
                tips = "是否删除以下教师用户?";
                userInfo = "<br>工号：" + userId + "<br/>姓名：" + userName;
            }
            else if(userType === "maintainer"){
                tips = "是否删除以下维修员用户?";
                userInfo = "<br>工号：" + userId + "<br/>姓名：" + userName;
            }

            str = "<div style='text-align:center;margin-bottom: 5px'>" +
                "<label style='font-size: 17px' ><b>" + tips + "</b></label>" +
                "</div>" +
                "<div style='text-align:center;'>" +
                userInfo +
                "</div>" +
                "<div style='float: right;margin-left: 20px'>" +
                "<button class='table-operation-botton'style='font-size: 16px' onclick='msgbox(0)'>取消</button>" +
                "</div>" +
                "<div style='float: right;'>" +
                "<button class='table-operation-botton'style='font-size: 16px' onclick='deleteUser(" + "\"" + userId + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + keyWord + "\"" + "," + "\"" + page + "\"" + ")'>确定</button>" +
                "</div>";

            $("#deleteContent").append(str);
            msgbox(1);
        }
        //ajax删除用户请求
        function deleteUser(id,userType,keyWord,page) {
            $.ajax({
                url: "/deleteUser?userType=" + userType + "&id=" + id,
                contentType:"application/json;charset=UTF-8",
                type: "get",
                data: {},
                success: function(data){
                    alert("成功删除");
                    msgbox(0);
                    if(userType === "student"){
                        getStudent(page,keyWord);
                    }
                    else if(userType === "teacher"){
                        getTeacher(page,keyWord);
                    }
                    else if(userType === "maintainer"){
                        getMaintainer(page,keyWord);
                    }
                },
                error: function(msg){
                    alert("删除失败："+msg);
                    msgbox(0);
                }
            });
        }
        //重置用户密码的警告提示弹窗
        function resetPasswordWarning(userId,userName,userType,keyWord,page) {
            $("#resetPasswordContent").empty();
            var str = "";
            var tips = "";
            var userInfo = "";
            if (userType === "student"){
                tips = "是否重置以下学生用户的密码?";
                userInfo = "<br>学号：" + userId + "<br/>姓名：" + userName;
            }
            else if(userType === "teacher"){
                tips = "是否重置以下教师用户的密码?";
                userInfo = "<br>工号：" + userId + "<br/>姓名：" + userName;
            }
            else if(userType === "maintainer"){
                tips = "是否重置以下维修员用户的密码?";
                userInfo = "<br>工号：" + userId + "<br/>姓名：" + userName;
            }

            str = "<div style='text-align:center;margin-bottom: 5px'>" +
                "<label style='font-size: 17px' ><b>" + tips + "</b></label>" +
                "</div>" +
                "<div style='text-align:center;'>" +
                userInfo +
                "</div>" +
                "<div style='float: right;margin-left: 20px'>" +
                "<button class='table-operation-botton'style='font-size: 14px' onclick='msgbox(0)'>取消</button>" +
                "</div>" +
                "<div style='float: right;'>" +
                "<button class='table-operation-botton'style='font-size: 14px' onclick='resetPassword(" + "\"" + userId + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + keyWord + "\"" + "," + "\"" + page + "\"" + ")'>确定</button>" +
                "</div>";

            $("#resetPasswordContent").append(str);
            msgbox(2);
        }
        //ajax重置用户密码的请求
        function resetPassword(id,userType,keyWord,page) {
            $.ajax({
                url: "/resetPassword?userType=" + userType + "&id=" + id,
                contentType:"application/json;charset=UTF-8",
                type: "get",
                data: {},
                success: function(data){
                    alert("成功重置");
                    msgbox(0);
                    if(userType === "student"){
                        getStudent(page,keyWord);
                    }
                    else if(userType === "teacher"){
                        getTeacher(page,keyWord);
                    }
                    else if(userType === "maintainer"){
                        getMaintainer(page,keyWord);
                    }
                },
                error: function(msg){
                    alert("重置失败："+msg);
                    msgbox(0);
                }
            });
        }

        //ajax动态请求当前页的学生列表，page为请求的页数,search为搜索内容作为数据库模糊搜索
        function getStudent(page,search){
            //设置选择框的作用对象类型
            document.getElementById("display-content-id").setAttribute("type","student");
            if(search == null || search === "undefined")
                search = "";
            $.ajax({
                url: "/getStudentList?curPage=" + page + "&search=" + search,
                contentType:"application/json;charset=UTF-8",
                type: "get",
                data: {},
                success: function(data){
                    //清除原先内容
                    $(".content").empty();
                    //获取列表信息并将null转成空白
                    data = null2str(data);
                    var studentList = data.studentList;
                    var searchKeyword = data.keyWord;
                    var totalRecord = data.totalRecord;
                    var userType = "student";
                    var str = "";
                    if(searchKeyword != "" && searchKeyword != null){
                        str += "<div style='margin-bottom: 10px'>“" + searchKeyword + "”的搜索结果:</div>";
                    }
                    //定义表列头
                    str +=  "<div class='table-div'>" +
                        "共" + data.sumPage+ "页，" + totalRecord +"条记录<br/>" +
                        "<table border='1' >" +
                        "<tr bgcolor='#F7F7F7'>" +
                        "<td style='width: 200px'>学号</td>" +
                        "<td style='width: 200px'>姓名</td>" +
                        "<td style='width: 200px'>专业</td>" +
                        "<td style='width: 200px'>班级</td>" +
                        "<td style='width: 200px'>性别</td>" +
                        "<td style='width: 200px'>电话</td>" +
                        "<td style='width: 200px'>邮箱</td>" +
                        "<td style='width: 200px'>宿舍区</td>" +
                        "<td style='width: 200px'>楼栋</td>" +
                        "<td style='width: 200px'>房间号</td>" +
                        "<td  style='width: 200px' colspan='2' align='center'>操作</td>" +
                        "</tr>";

                    //循环将显示内容用字符串拼接
                    for (var i = 0; i < studentList.length; i++) {
                        //拼接表格的行和列
                        str += "<tr><td>" + studentList[i].id + "</td><td>" + studentList[i].name + "</td><td>"
                            + studentList[i].major + "</td><td>"
                            + studentList[i].classes + "</td><td>" + studentList[i].sex + "</td><td>"
                            + studentList[i].telephone + "</td><td>" + studentList[i].mail + "</td><td>" + studentList[i].dormregion + "</td><td>"
                            + studentList[i].dormbuilding + "</td><td>" + studentList[i].dormroom + "</td><td>"
                            + "<button class='table-operation-botton' onclick='deleteWarning(" + "\"" + studentList[i].id + "\"" + "," + "\"" + studentList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + "); '>删除</button></td>"
                            + "<td><button class='table-operation-botton' onclick='resetPasswordWarning(" + "\"" + studentList[i].id + "\"" + "," + "\"" + studentList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + ");'>重置密码</button></td>"
                            + "</tr>";
                        //追加到table中
                    }
                    var lastPage;//上一页
                    var nextPage;//下一页
                    //对上、下页的范围限制
                    if((page - 1) <= 1){
                        lastPage = 1;
                    }
                    else lastPage = page - 1;
                    if((page + 1) >= data.sumPage){
                        nextPage = data.sumPage;
                    }
                    else nextPage = page + 1;

                    str +="</table></div>" +
                        "<div style='margin-top: 5px;'>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getStudent(1," + searchKeyword + ")'>首页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getStudent(" +  lastPage  + " ," + searchKeyword + ")'>上一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getStudent(" +  page  + " ," + searchKeyword + ")'>当前第" + page + "页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getStudent(" +  nextPage  + " ," + searchKeyword + ")'>下一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getStudent(" +  data.sumPage  + " ," + searchKeyword + ")'>尾页</button></div>" +
                        "<div style='float: left;margin-right: 3%'>跳至 <input id='jumpPage' type='text' style='width: 50px'/> 页</div>" +
                        "<div style='float: left;'><button class='jumpbtn' id='stu-search-btn' onclick='JumpCheck(" + data.sumPage + "," + "\"" + userType + "\"" + "," + searchKeyword + ")'>跳转</button></div>" +
                        "</div>";
                    $(".content").append(str);
                },
                error: function(msg){
                    alert("连接异常，请重新刷新："+msg);
                }
            });
        }
        //ajax动态请求当前页的教师列表
        function getTeacher(page,search){
            //设置选择框的作用对象类型
            document.getElementById("display-content-id").setAttribute("type","teacher");
            if(search == null || search === "undefined")
                search = "";
            $.ajax({
                url: "/getTeacherList?curPage=" + page + "&search=" + search,
                contentType:"application/json;charset=UTF-8",
                type: "get",
                data: {},
                success: function(data){
                    //清除原先内容
                    $(".content").empty()
                    //获取列表信息并将null转成空白
                    data = null2str(data);
                    var teacherList = data.teacherList;
                    var searchKeyword = data.keyWord;
                    var userType = "teacher";
                    var totalRecord = data.totalRecord;
                    var str = "";
                    if(search != "" && search != null){
                        str += "<div style='margin-bottom: 10px'>“" + search + "”的搜索结果:</div>";
                    }
                    //定义表列头
                    str +=  "<div class='table-div' >" +
                        "共" + data.sumPage+ "页，" + totalRecord +"条记录<br/>" +
                        "<table border='1'>" +
                        "<tr bgcolor='#F7F7F7'>" +
                        "<td style='width: 200px'>工号</td>" +
                        "<td style='width: 200px'>姓名</td>" +
                        "<td style='width: 200px'>性别</td>" +
                        "<td style='width: 200px'>电话</td>" +
                        "<td style='width: 200px'>邮箱</td>" +
                        "<td style='width: 200px'>宿舍区</td>" +
                        "<td style='width: 200px'>楼栋</td>" +
                        "<td style='width: 200px'>房间号</td>" +
                        "<td style='width: 200px' colspan='2' align='center'>操作</td>" +
                        "</tr>";

                    //循环将显示内容用字符串拼接
                    for (var i = 0; i < teacherList.length; i++) {
                        //拼接表格的行和列
                        str += "<tr><td>" + teacherList[i].id + "</td><td>" + teacherList[i].name + "</td><td>"
                            + teacherList[i].sex + "</td><td>"
                            + teacherList[i].telephone + "</td><td>" + teacherList[i].mail + "</td><td>" + teacherList[i].dormregion + "</td><td>"
                            + teacherList[i].dormbuilding + "</td><td>" + teacherList[i].dormroom + "</td><td>"
                            + "<button class='table-operation-botton' onclick='deleteWarning(" + "\"" + teacherList[i].id + "\"" + "," + "\"" + teacherList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + "); '>删除</button></td>"
                            + "<td><button class='table-operation-botton' onclick='resetPasswordWarning(" + "\"" + teacherList[i].id + "\"" + "," + "\"" + teacherList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + ");'>重置密码</button></td>"
                            + "</tr>";
                        //追加到table中
                    }
                    var lastPage;//上一页
                    var nextPage;//下一页
                    //对上、下页的范围限制
                    if((page - 1) <= 1){
                        lastPage = 1;
                    }
                    else lastPage = page - 1;
                    if((page + 1) >= data.sumPage){
                        nextPage = data.sumPage;
                    }
                    else nextPage = page + 1;

                    str +="</table></div>" +
                        "<div style='margin-top: 5px;'>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getTeacher(1," + searchKeyword + ")'>首页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getTeacher(" +  lastPage  + " ," + searchKeyword + ")'>上一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getTeacher(" +  page  + " ," + searchKeyword + ")'>当前第" + page + "页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getTeacher(" +  nextPage  + " ," + searchKeyword + ")'>下一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getTeacher(" +  data.sumPage  + " ," + searchKeyword + ")'>尾页</button></div>" +
                        "<div style='float: left;margin-right: 3%'>跳至 <input id='jumpPage' type='text' style='width: 50px'/> 页</div>" +
                        "<div style='float: left;'><button class='jumpbtn' id='stu-search-btn' onclick='JumpCheck(" + data.sumPage + "," + "\"" + userType + "\"" + "," + searchKeyword + ")'>跳转</button></div>" +
                        "</div>";
                    $(".content").append(str);
                },
                error: function(msg){
                    alert("连接异常，请重新刷新："+msg);
                }
            });
        }
        //ajax动态请求当前页的维修员列表
        function getMaintainer(page,search){
            //设置选择框的作用对象类型
            document.getElementById("display-content-id").setAttribute("type","maintainer");
            if(search == null || search === "undefined")
                search = "";
            $.ajax({
                url: "/getMaintainerList?curPage=" + page + "&search=" + search,
                contentType:"application/json;charset=UTF-8",
                type: "get",
                data: {},
                success: function(data){
                    //清除原先内容
                    $(".content").empty();
                    //获取列表信息并将null转成空白
                    data = null2str(data);
                    var maintainerList = data.maintainerList;
                    var searchKeyword = data.keyWord;
                    var userType = "maintainer";
                    var totalRecord = data.totalRecord;
                    var str = "";
                    if(search != "" && search != null){
                        str += "<div style='margin-bottom: 10px'>“" + search + "”的搜索结果:</div>";
                    }
                    //定义表列头
                    str +=  "<div class='table-div' >" +
                        "共" + data.sumPage+ "页，" + totalRecord +"条记录<br/>" +
                        "<table border='1'>" +
                        "<tr bgcolor='#F7F7F7'>" +
                        "<td style='width: 200px'>工号</td>" +
                        "<td style='width: 200px'>姓名</td>" +
                        "<td style='width: 200px'>性别</td>" +
                        "<td style='width: 200px'>电话</td>" +
                        "<td style='width: 200px'>邮箱</td>" +
                        "<td style='width: 200px'>职位</td>" +
                        "<td style='width: 200px'>部门</td>" +
                        "<td style='width: 200px' colspan='2' align='center'>操作</td>" +
                        "</tr>";

                    //循环将显示内容用字符串拼接
                    for (var i = 0; i < maintainerList.length; i++) {
                        //拼接表格的行和列
                        str += "<tr><td>" + maintainerList[i].id + "</td><td>" + maintainerList[i].name + "</td><td>"
                            + maintainerList[i].sex + "</td><td>"
                            + maintainerList[i].telephone + "</td><td>" + maintainerList[i].mail + "</td><td>"
                            + maintainerList[i].role + "</td><td>" + maintainerList[i].groups + "</td><td>"
                            + "<button class='table-operation-botton' onclick='deleteWarning(" + "\"" + maintainerList[i].id + "\"" + "," + "\"" + maintainerList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + "); '>删除</button></td>"
                            + "<td><button class='table-operation-botton' onclick='resetPasswordWarning(" + "\"" + maintainerList[i].id + "\"" + "," + "\"" + maintainerList[i].name + "\"" + "," + "\"" + userType + "\"" + "," + "\"" + searchKeyword + "\"" + "," + "\"" + page + "\"" + ");'>重置密码</button></td>"
                            + "</tr>";
                        //追加到table中
                    }
                    var lastPage;//上一页
                    var nextPage;//下一页
                    //对上、下页的范围限制
                    if((page - 1) <= 1){
                        lastPage = 1;
                    }
                    else lastPage = page - 1;
                    if((page + 1) >= data.sumPage){
                        nextPage = data.sumPage;
                    }
                    else nextPage = page + 1;

                    str +="</table></div>" +
                        "<div style='margin-top: 5px;'>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getMaintainer(1," + searchKeyword + ")'>首页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getMaintainer(" +  lastPage  + " ," + searchKeyword + ")'>上一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getMaintainer(" +  page  + " ," + searchKeyword + ")'>当前第" + page + "页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getMaintainer(" +  nextPage  + " ," + searchKeyword + ")'>下一页</button></div>" +
                        "<div style='float: left;margin-right: 6%'><button class='jumpbtn' style='cursor: pointer;' onclick='getMaintainer(" +  data.sumPage  + " ," + searchKeyword + ")'>尾页</button></div>" +
                        "<div style='float: left;margin-right: 3%'>跳至 <input id='jumpPage' type='text' style='width: 50px'/> 页</div>" +
                        "<div style='float: left;'><button class='jumpbtn' id='stu-search-btn' onclick='JumpCheck(" + data.sumPage + "," + "\"" + userType + "\"" + "," + searchKeyword + ")'>跳转</button></div>" +
                        "</div>";
                    $(".content").append(str);
                },
                error: function(msg){
                    alert("连接异常，请重新刷新："+msg);
                }
            });
        }


    </script>
    <!-- 用户信息以及功能展示开始 -->
    <div class="my-account-wrapper section-padding" style="margin-left: -200px;height: 740px;margin-top: -75px" >
        <div class="container" style="margin-top: 20px">
            <div class="section-bg-color">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="myaccount-page-wrapper">
                            <div class="row">
                                <div class="col-lg-3 col-md-4">
                                    <div class="myaccount-tab-menu nav" role="tablist">
                                        <a id="btn1" href="#listUser" class="active" data-toggle="tab"><i class="fa fa-address-book-o "></i>
                                            用户列表</a>
                                        <a id="btn2" href="addUser"><i class="fa fa-comments-o"></i>
                                            添加用户</a>
                                    </div>
                                </div>

                                <div class="col-lg-9 col-md-8">
                                    <div class="tab-content" id="myaccountContent">
                                        <!-- 添加用户开始 -->
                                        <div class="tab-pane fade show active" id="listUser" role="tabpanel">
                                            <div class="myaccount-content">
                                                <div class="myaccount-table table-responsive text-center">
                                                    <div class="myaccount-tab-menu nav" role="tablist" style="-webkit-flex-direction:row">
                                                        <a id="btn2-1" href="#studentList" onclick="getStudent(1,'')" data-toggle="tab" style="width:180px;text-align:left;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(229, 229, 229)"><i class="fa fa-comments-o"></i>
                                                            学生列表</a>
                                                        <a id="btn2-2" href="#teacherList" onclick="getTeacher(1,'')" data-toggle="tab" style="width:180px;text-align:left;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(229, 229, 229)"><i class="fa fa-file-audio-o "></i>
                                                            教师列表</a>
                                                        <a id="btn2-3" href="#maintainerList" onclick="getMaintainer(1,'')" data-toggle="tab" style="width:180px;text-align:left;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(229, 229, 229)"><i class="fa fa-file-audio-o "></i>
                                                            维修部列表</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- 添加用户结束 -->
                                    </div>

                                    <!--用户列表三个部分开始-->
                                    <div  class="myaccount-content blog-comment-wrapper" style=" margin-top: 20px; width: 1050px;height: 500px; ">
                                        <h5>用户列表</h5>
                                        <div class="myaccount-table table-responsive" style="margin-left: 1px">
                                            <div class='search-div' style='margin-bottom: 5px'>
                                                <input  id='search-keyword' type='text' placeholder="搜索..." style="height: 24px;float: none;margin: 0;"/>
                                                <button class="table-operation-botton " id='stu-search-btn' onclick="getUserByKeyword()" style="padding: 6px 8px;cursor: pointer;float: none;margin: 0;"><i class="fa fa-search"></i></button>
                                            </div>

                                            <div id="display-content-id" class="content ">

                                            </div>
                                            <div class="layui-form layui-form-pane floating-box light-content" style="background-color: white" id="deleteWarning-div">
                                                <%--<a style=" font-size:18px; text-align:right; display:block;" onclick="msgbox(0); return false;"><small><b>关闭</b></small></a>--%>
                                                <button onclick="msgbox(0); return false;" type="button" class="close" data-dismiss="modal">&times;</button>
                                                <div id="deleteContent">

                                                </div>
                                            </div>
                                            <div class="layui-form layui-form-pane floating-box light-content" style="background-color: white" id="resetPasswordWarning-div">
                                                <%--<a style=" font-size:18px; text-align:right; display:block;" onclick="msgbox(0); return false;"><small><b>关闭</b></small></a>--%>
                                                <button onclick="msgbox(0); return false;" type="button" class="close" data-dismiss="modal">&times;</button>
                                                <div id="resetPasswordContent">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!--用户列表结束-->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<div id="fade" class="black-all"></div>
<!-- footer area start -->
<footer class="black-bg">
    <div class="footer-middle-area">
        <div class="container">
            <div class="row mtn-30">
                <div class="col-lg-6 col-sm-12">
                    <div class="address-block mt-30">
                        <div class="footer-logo">
                            <a href="#">
                                <img src="img/2.jpg" alt="Brand Logo">
                            </a>
                        </div>
                        <address class="address-info d-flex align-items-center">
                            <i class="fa fa-map-marker"></i>
                            <p><span>ADDRESS : </span> 梦翔大厦</p>
                        </address>
                    </div>
                </div>
                <div class="col-lg-3 col-sm-6">
                    <address class="address-info email mt-30">
                        <i class="fa fa-envelope"></i>
                        <p><span>EMAIL : </span><a href="#">xxxx@qq.com</a></p>
                    </address>
                </div>
                <div class="col-lg-3 col-sm-6">
                    <address class="address-info email mt-30">
                        <i class="fa fa-phone"></i>
                        <p><span>PHONE : </span><a href="#">158xxxxx9442</a></p>
                    </address>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-bottom-area text-center">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="payment-method-list">

                    </div>

                    <p class="copyright">
                        Copyright © www.xxx.com
                    </p>
                </div>
            </div>
        </div>
    </div>
</footer>
<!-- footer area end -->

</body>

</html>
